import usePartState from "@module/usePartState";
import Rest from "@module/Rest";



export default function AddFile(props) {
    const [stateObj, updateState] = usePartState({
        showTips:false,
        tips:``,
        isUpload:false,
        filePath:'',
        fileId:''
    });

    const {showTips,tips,isUpload,filePath,fileId}=stateObj;
    const {formData}= props;

    function upload() {
        let ele=document.querySelector('.bid-inputbid-file-input')
        if(ele){
            ele.click()
        }
    }



    function onChange(files,){
        const file = files[0];
        let fType;
        let fileExt;
        if(!file){
            return null;
        }
        if(file.type){
            fType = /(application\/msword)|(application\/vnd.ms-excel)|(application\/vnd\.openxmlformats-officedocument\.spreadsheetml\.sheet)|(application\/pdf)|(application\/x-zip-compressed)|(application\/x-rar-compressed)|(image\/jpeg)|(image\/jpg)|(image\/png)/.test(file.type);
        }else{
            fileExt=file.name.substr(file.name.lastIndexOf(".")).toLowerCase();//获得文件后缀名
            fType = /(.jpg)|(.jpeg)|(.png)|(.xlsx)|(.doc)|(.docx)|(.pdf)|(.rar)|(.zip)/.test(fileExt) ;  // 当文件类型type为空的时候判断文件后缀名
        }
        let fSize = file.size;
        if(fSize > 10485760) {
            updateState({showTips:true,tips:`支持小于10M的文件`});
        } else if(!fType) {
            updateState({showTips:true,tips:`支持 excel、word、pdf、rar、zip格式文件`});
        } else {
            doUpload(file);
        }
    }

    function doUpload(file){
        let url=`/bid/file/upload`;
        // let url=`https://www.gray.rjmart.cn/bid/file/upload`;
        let params={
            file,
            orgId:'',
            depId:'',
            fileType:1,
            userType:1
        }
        Rest.uploadFile(url,params)
            .then(res=>{
                console.log(res);
                if(res.resultCode=='0000'){
                    getFilePath(res)
                }
                else{
                    updateState({
                        showTips:true,
                        tips:'文件上传失败！'
                    })
                }
            })
            .catch(err=>{
                console.log(err);
                updateState({
                    showTips:true,
                    tips:'文件上传失败！'
                })
            })
    }

    function getFilePath(res) {
        const inputEle=document.querySelector('#bid-inputbid-file-input');
        if(inputEle){
            updateState({
                isUpload:true,
                filename:res.fileName,
                filePath:inputEle.value,
                fileId:res.id,
                showTips:false,
            })
            formData.fileId=res.id
            formData.filePath=inputEle.value
        }
    }


    function handleChange(e) {
        onChange(e.target.files)
    }


    function deleteUpload() {
        updateState({
            isUpload:false,
            filename:'',
            filePath:'',
            fileId:''
        })
        formData.fileId=''
        formData.filePath=''
    }


    return (
        <div>
            <div className={'bid-inputbid-content-inputs'}>
                <div className={'bid-inputbid-label6-box'}>
                    {/*<span className={'zen_red'}>*</span>*/}
                    <span className={'bid-inputbid-label'}>{'补充资料'}</span>
                    <span className={'bid-inputbid-dots'}>:</span>
                </div>
                <div className={'bid-inputbid-inputs-input'}>
                    <input
                        type="file"
                        id="bid-inputbid-file-input"
                        className="bid-inputbid-file-input"
                        name="file"
                        onChange={handleChange}
                    />
                    {
                        isUpload?
                            <div className="bid-inputbid-upload-wrapper">
                                <p className='zen_0093EB zen_fs-14 zen_m-r-10' >{filePath}</p>
                                <div
                                    onClick={()=>{
                                        upload()
                                    }}
                                    className={'bid-inputbid-upload'}>
                                    更换附件
                                </div>
                                <div
                                    onClick={()=>{
                                        deleteUpload()
                                    }}
                                    className={'bid-inputbid-delete-upload'}>
                                    删除附件
                                </div>
                            </div>
                                :
                            <div
                                onClick={()=>{
                                    upload()
                                }}
                                className={'bid-inputbid-upload'}>
                                上传附件
                            </div>
                    }

                    <p className={'bid-inputbid-r-tip'}>支持excel、word、pdf、rar、zip格式文件。</p>
                </div>
            </div>
            {
                showTips&& <p className={'bid-inputbid-error-tip'}>{tips}</p>
            }

        </div>

    )
}